// @flow
import React, { Component } from 'react';
import { BrowserRouter, Route, Link, Switch, Redirect } from "react-router-dom";
import  Home from './component/home.jsx';
import  User  from './component/user.jsx';
import  Test  from './component/test.jsx';
import  Head  from './baseComponent/head.jsx';
import  Foot  from './baseComponent/foot.jsx';

type Props = {
  foo: number,
  bar?: string,
};
type State = {
  test: string,
  toSom?: Array<string>,
};

export default class App extends Component<Props,State>{
  constructor(props: any, name: string) {
    super(props);
    this.state = {
      test: 'luyouxin',
      toSom: [
        'hello son',
        'hello 2'
      ],
    };
    // this.handleClick = this.handleClick.bind(this);
  }
  componentDidMount() {
    // this.getFontSize();
  }
  handleClick(t,n){
    console.log('this is:', this);
    console.log('t is:', t);
    console.log('n is:', n);
  }
  render() {
    return (
      <div className="App">
        <div className="content">
          <div className="content-container">
            <div>
              <BrowserRouter>
                <div>
                  <Head />      
                  <Route path='/' exact component={Home}/>
                  <Route path='/user' component={User}/>
                  <Route path='/test' component={Test}/>                
                  <Foot />
                </div>
              </BrowserRouter>
            </div>
          </div>
        </div>
      </div>
    );
  }
}
